<template>
  <view class="flex-col page">
    <view class="flex-col group">
      <view class="flex-col">
        <view class="flex-col list_1" :key="i" v-for="(item, i) in list">
           <view  v-if="item.desc || item.conversationID">
           	<view  class="flex-row list-item" @click="goDeatil(item)">
           	  <view class="flex-col items-center group_8">
           	    <image
           	       :src="item.img"
           	      class="image_6"
           	    />
           	    <view class="flex-col items-center badge" v-if="item.num>0"><text class="text_1">{{item.num}}</text></view>
           	  </view>
           	  <view class="flex-col items-start group_2">
           	    <text class="text_3">{{item.name}}</text>
           	    <text class="text_5">{{item.desc}}</text>
           	  </view>
           	</view>
           	<image
           	:src="imgUrl+'16557862506497898294.png'"
           	 
           	  class="list-divider image_1"
           	  v-if="i !== 1"
           	/>
           </view>
           
         
        </view>
      </view>
	<!--  <view class="" v-else>
	  	<u-empty style="height: 100vh;" width="250" mode="data" textSize="30rpx"
	  		icon="http://cdn.uviewui.com/uview/empty/order.png">
	  	</u-empty>
	  </view> -->
      <view class="flex-col items-end section_2 " v-if="havedata">
        <view class="flex-col items-center text-wrapper_2" @click="empty"><text class="text_13">全部已读</text></view>
      </view>
    </view>

	
	
  </view>
</template>

<script>
import { setTokenStorage } from '@/static/js/tim/utils/token';
	
const { getTokenStorage } = require('@/static/js/tim/utils/token.js');
  import { genTestUserSig } from '@/static/js/tim/GenerateTestUserSig.js';
  const app = getApp();
  export default {
    components: {},
    data() {
      return {
		  havedata:false,
		userID:'',
		  imgUrl:this.$IMG_URL,
       list: [
       {
         img:this.$IMG_URL+'my/message/m1@2x.png',
         type:0,
         num:0,
         name:'平台公告',
         desc:''		  
       },
       {
       img:this.$IMG_URL+'my/message/m2@2x.png',
        type:1,
         num:0,
       name:'主材采购提示',
       desc:''		
       },
       {
       img:this.$IMG_URL+'my/message/m3@2x.png',
        type:2,
        num:0,
        name:'巡检提醒',
       desc:''		
       },
       {
       img:this.$IMG_URL+'my/message/m4@2x.png',
        type:3,
        num:0,
        name:'订单消息',
        desc:''		
       },
     
       ],
      };
    },
  created() {
  this.init();
  },
  mounted() {
	  let num=0;
  	 this.list.map(item=>{
		 if(tem.desc || item.conversationID)
		 {
			 num+=1;
		 }
		 
	 })
	 if(num>0)
	 {
		 this.havedata=true;
	 }
  },
    methods: {
		init()
		{
			this.getList();
			this.getGonggao();
			this.getMaterial();
			this.queryInspectionMessage();
			this.queryOrderMessage();
		},
		empty()
		{
		  
		  			uni.showModal({
		  					title: '提示',
		  					// 提示文字
		  					content: '确认全部已读吗？',
		  					// 取消按钮的文字自定义
		  					cancelText: "取消",
		  					// 确认按钮的文字自定义
		  					confirmText: "确认",
		  					//删除字体的颜色
		  					confirmColor:'red',
		  					//取消字体的颜色
		  					cancelColor:'#000000',
		  					success: res=> {
		  					if (res.confirm) {
		  						this.$http('message.empty').then(r=>{
		  						   if(r.code==200)
		  						   {
		  							  this.init();
									  this.setReadMessage();
		  						   }
		  						});
		  					}else {
		  						// 执行取消后的操作
		  					}
		  				}
		  			
		  		
		  })
		},
		getGonggao()
		{
			this.$http('message.article',{
						  pageNum:1,
						  pageSize:1
			}).then(r=>{
				 if(r.code==200)
				 {
					 if(r.code==200 && r.data)
					 {
					 				let item=this.list[0];
					 				item.num=r.data.msg;
					 			    if(r.data.length>0)
									{
										item.desc=r.data[0].summary;
									}
					 				
					 				this.$set(this.list,0,item) 
					 }else{
						this.$set(this.list,0,[]) 
					 }
				 }
			});
		},
		setReadMessage()
		{
			this.list.forEach(item=>{
				if(item.type==5 && item.conversationID)
				{
					uni.$TUIKit.setMessageRead({
									conversationID:item.conversationID
								}).then(() => {
								 console.log('TUI-chat | setMessageRead  | ok');
					});
					
				}
			});
			this.init()
		},
		queryInspectionMessage()
		{
		  this.$http('message.queryInspectionMessage',{
			  pageNum:1,
			  pageSize:1
		  }).then(r=>{
			  console.log('inspectionmess');
			  console.log(r.data.length);
			 if(r.code==200 &&  r.data.length>0)
			 {
				let item=this.list[2];
				item.num=r.msg;
			     if(r.data.length>0)
				 {
					item.desc=r.data[0].message; 
				 }
				
				this.$set(this.list,2,item) 
			 }else{
					this.$set(this.list,2,[]) 
				}
		  });	
		},
		queryOrderMessage()
		{
			this.$http('message.queryOrderMessage',{
						  pageNum:1,
						  pageSize:1
			}).then(r=>{
				console.log('ordermessage');
				console.log( r.data.length);
						 if(r.code==200 && r.data.length>0)
						 {
							let item=this.list[3];
							item.num=r.msg;
						    if(r.data.length>0)
							{
								item.desc=r.data[0].message;
							}
							
							this.$set(this.list,3,item) 
						 }else{
						this.$set(this.list,3,[]) 
				}	 
			});
		},
		getMaterial()
		{
			this.$http('message.materialInformationId').then(r=>{
			    if(r.code==200 && r.data.length>0)
				{
					console.log('aaaa');
					let item=this.list[1];
					item.num=r.data.size;
					item.name=r.data.information;
					item.desc=r.data.tips;
				    this.$set(this.list,1,item)
				}else{
					 this.$set(this.list,1,[])
				}
			});
		},
		getList()
		{
			// 登入后拉去会话列表
			this.getConversationList();
			uni.$TUIKit.on(uni.$TUIKitEvent.CONVERSATION_LIST_UPDATED, this.onConversationListUpdated);
		},
		onConversationListUpdated(event) {
			console.log('TUI-conversation | onConversationListUpdated  |ok');
			console.log(event.data);
			this.setData({
				conversationList: event.data
			});
		},
		getConversationList() {
			console.log(11111);
			uni.$TUIKit.getConversationList().then(imResponse => {
				console.log(imResponse);
				// logger.log(`TUI-conversation | getConversationList | getConversationList-length: ${imResponse.data.conversationList.length}`);
				// this.setData({
				// 	conversationList: imResponse.data.conversationList
				// });
				let arr=[];
				imResponse.data.conversationList.forEach(item=>{
					 arr.push({
						 img:this.setConversationAvatarHandler(item),
						 type:5,
						 num:item.unreadCount,
						 name:this.getConversationName(item),
						 desc:item.lastMessage.messageForShow,
						 conversationID:item.conversationID
						
					 });
					 
				})
				this.list=this.list.concat(arr);
				console.log('list');
				console.log(this.list);
			});
		},
		setConversationAvatarHandler(conversation) {
			console.log(conversation);
			if (conversation.type === '@TIM#SYSTEM') {
				return 'https://web.sdk.qcloud.com/component/TUIKit/assets/system.png';
			}
		
			if (conversation.type === 'C2C') {
				return conversation.userProfile.avatar || 'https://sdk-web-1252463788.cos.ap-hongkong.myqcloud.com/component/TUIKit/assets/avatar_21.png';
			}
		
			if (conversation.type === 'GROUP') {
				return conversation.groupProfile.avatar || '/static/static/assets/gruopavatar.svg';
			}
		},
		getConversationName(conversation) {
			if (conversation.type === '@TIM#SYSTEM') {
				return '系统通知';
			}
		
			if (conversation.type === 'C2C') {
				return conversation.remark || conversation.userProfile.nick || conversation.userProfile.userID;
			}
		
			if (conversation.type === 'GROUP') {
				return conversation.groupProfile.name || conversation.groupProfile.groupID;
			}
		},
		login() {
			const userID = this.userID;
			const userSig = genTestUserSig(userID).userSig;
			const SDKAppID = app.globalData.SDKAppID;
			console.log(`TUI-login | login  | userSig:${userSig} userID:${userID}`);
			// #ifdef  APP-PLUS
			uni.$aegis.reportEvent({
			    name: 'platform',
			    ext1: 'platform-APP',
			    ext2: 'uniTuikitExternal',
			    ext3: `${SDKAppID}`,
			})
			// #endif
			// #ifdef MP-WEIXIN  
			uni.$aegis.reportEvent({
			    name: 'platform',
			    ext1: 'platform-MP-WEIXIN',
			    ext2: 'uniTuikitExternal',
			    ext3: `${SDKAppID}`,
			})
			// #endif
			// #ifdef H5
			uni.$aegis.reportEvent({
			    name: 'platform',
			    ext1: 'platform-H5',
			    ext2: 'uniTuikitExternal',
			    ext3: `${SDKAppID}`,
			})
			// uni.showToast({
			// 	title: 'TUIKit 暂不支持 H5 / web ，请使用者自己完成兼容哦～ ',
			// 	icon: 'none',
			// 	duration: 3000
			// });
			// #endif
			app.globalData.userInfo = {
				userSig,
				userID
			};
			setTokenStorage({
				userInfo: app.globalData.userInfo
			});
			wx.setStorageSync(`TIM_${getApp().SDKAppID}_isTUIKit`, true);
			uni.$TUIKit.login({
				userID: userID,
				userSig: userSig
			}).then(() => {
				uni.$aegis.reportEvent({
				    name: 'login',
				    ext1: 'login-success',
				    ext2: 'uniTuikitExternal',
				    ext3: `${SDKAppID}`,
				})
			}).catch((error) => {
				uni.$aegis.reportEvent({
				    name: 'login',
				    ext1: `login-failed#error:${error}`,
				    ext2: 'uniTuikitExternal',
				    ext3: `${SDKAppID}`,
				})
			})
			
			// 登录原生插件
			// #ifdef APP-PLUS
			if(typeof(uni.$TUICalling) == 'undefined') {
				uni.showToast({
					title: '如果需要音视频功能，请集成插件使用真机运行并且自定义基座调试哦～',
					icon: 'none',
					duration: 3000
				});
				logger.error('请使用真机运行并且自定义基座调试，否则影响音视频功能～ 插件地址：https://ext.dcloud.net.cn/plugin?id=7097 , 调试地址：https://nativesupport.dcloud.net.cn/NativePlugin/use/use');
			} else {
				uni.$TUICalling.login(
					{
						sdkAppID: SDKAppID,
						userID: userID,
						userSig: userSig
					},
					res => {
						console.log(JSON.stringify(res.msg));
						uni.showToast({
							title: 'login',
							icon: 'none'
						});
					}
				);
			}
			
			// #endif
			if (this.path && this.path !== 'undefined') {
				uni.redirectTo({
					url: this.path
				});
			} else {
			        console.log('登录成功');
			}
		},
		goDeatil(item)
		{
			let url='';
			switch (item.type)
			{
				case 0: url='/pages/my/message/pingtaiMessage';
				break;
				case 1: url='/pages/my/message/zhucaiMessage';
				break;
				case 2: url='/pages/my/message/xunjianMessage';
				break;
				case 3: url='/pages/my/message/orderMessage';
				break;
				case 4: url='/pages/my/message/kefu';
				break;
				case 5: url='/pages/my/message/kefu?conversationID='+item.conversationID;
				break;
			}
			
			uni.navigateTo({
				url:url
			});
		}
	},
  };
</script>

<style scoped lang="scss">
  .list-item {
    padding: 30rpx 32rpx 31rpx;
  }
  .list-divider {
    align-self: flex-end;
    width: 572rpx;
    height: 2rpx;
  }
  .badge {
	  width:26rpx;
	  height:26rpx;
	  // padding:10rpx;
    // padding-bottom: 2rpx;
    border-radius: 50%;
	background-color: #F2362F;
    // background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557862506546894742.png');
    // background-size: 100% 100%;
    // background-repeat: no-repeat;
    // width: 24rpx;
    position: absolute;
    right: 0;
    top: 0;
  }
  .text_3 {
    color: #333333;
    font-size: 28rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 33rpx;
  }
  .text_5 {
    margin-top: 22rpx;
    color: #999999;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 28rpx;
  }
  .text_1 {
    color: #ffffff;
    font-size: 18rpx;
    font-family: '.AppleSystemUIFont';
   
  }
  .page {
    background-color: #f6f7f9;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100vh;
  }
  .group {
    flex: 1 1 auto;
    overflow-y: auto;
  }
  .section_2 {
	  position: fixed;
	  bottom: 0;
	  left: 0;
	  right: 0;
    padding: 20rpx 0;
    background-color: #ffffff;
    box-shadow: 0px -2rpx 4rpx 0px #00000014;
  }
  .list_1 {
    background-color: #ffffffff;
  }
  .text-wrapper_2 {
    margin-right: 32rpx;
    padding: 9rpx 0 19rpx;
    background-color: #1d6aff14;
    border-radius: 28rpx;
    width: 148rpx;
  }
  .text_13 {
    color: #1d6aff;
    font-size: 24rpx;
    font-family: '.AppleSystemUIFont';
    line-height: 28rpx;
  }
  .image_1 {
    margin-right: 32rpx;
  }
  .group_8 {
    filter: drop-shadow(0px 3rpx 3rpx #c1000066);
    width: 90rpx;
    height: 90rpx;
    position: relative;
  }
  .group_2 {
    margin-left: 24rpx;
    margin-bottom: 9rpx;
    flex: 1 1 auto;
  }
  .image_6 {
    filter: drop-shadow(0px 3rpx 3rpx #c1000066);
    width: 90rpx;
    height: 90rpx;
  }
</style>